<!--所有订单-->
<!--订单-->

<div class="navbar">
    <div class="navbar-inner">
        <div class="left sliding"><a href="./index/user.html" class="link"><i class="icon icon-back"></i></a>
        </div>
        <div class="center sliding">订单中心</div>
        <div class="right"></div>
    </div>
</div>

<div class="pages navbar-through">
    <div data-page="orders" class="page with-subnavbar orders-page no-toolbar no-navbar">
        <div class="subnavbar sliding" style="top: 0">
            <div class="row tab-container">
                <a href="#tab1" class="tab-label col-auto tab-link active">待付款</a>
                <a href="#tab2" class="tab-label col-auto tab-link">代发货</a>
                <a href="#tab3" class="tab-label col-auto tab-link">待消费</a>
                <a href="#tab4" class="tab-label col-auto tab-link">已完成</a>
            </div>
            <div class="li-divider-15"></div>
        </div>
        <div class="tabs-animated-wrap">
            <div class="tabs" data-index="{{page}}">
                <div id="tab1" class="page-content tab active">
                    <div class="list-block orders-list">
                        <ul>
                            {{#each pay}}
                            <li>
                                <a href="./order/detail.html?id={{id}}&type=1">
                                    <div class="row">
                                        <span class="order-id">订单号：{{id}}</span>
                                        <span class="order-status">待支付</span>
                                    </div>
                                    <div class="row">
                                        <span class="order-time">下单时间：{{time}}</span>
                                    </div>
                                    <div class="divider-line" style="margin: 10px 0"></div>
                                    <div class="row order-content">
                                        <img class="col-33" src="{{image}}">
                                        <div class="col-66">
                                            <div class="goods-desc">
                                                <span>{{desc}}</span>
                                            </div>
                                            <span class="goods-number">数量：x{{number}}</span><br>
                                            <span class="goods-price">￥{{price}}</span>
                                        </div>
                                    </div>
                                    <div class="divider-line" style="margin: 10px 0"></div>
                                    <div class="row order-btns">
                                        <a class="button order-pay">立即支付</a>
                                        {{#if cancelBtn}}
                                        <a class="button order-cancel">取消订单</a>
                                        {{/if}}
                                    </div>

                                </a>
                            </li>
                            {{#unless @last}}
                            <div class="li-divider-15" style="padding: 0"></div>
                            {{/unless}}
                            {{/each}}
                        </ul>
                        <div class="row no-gutter divider" style="margin-top: 20px">
                            <div class="col-30 deep"></div>
                            <span>我也是有底线的</span>
                            <div class="col-30 deep"></div>
                        </div>
                    </div>
                </div>
                <div id="tab2" class="page-content tab">
                    <div class="list-block orders-list">
                        <ul>
                            {{#each orders}}
                            <li>
                                <a href="./order/detail.html?id={{id}}&type=2">
                                    <div class="row">
                                        <span class="order-id">订单号：{{id}}</span>
                                        <span class="order-status">待预约</span>
                                    </div>
                                    <div class="row">
                                        <span class="order-time">下单时间：{{time}}</span>
                                    </div>
                                    <div class="divider-line" style="margin: 10px 0"></div>
                                    <div class="row order-content">
                                        <img class="col-33" src="{{image}}">
                                        <div class="col-66">
                                            <div class="goods-desc">
                                                <span>{{desc}}</span>
                                            </div>
                                            <span class="goods-number">数量：x{{number}}</span><br>
                                            <span class="goods-price">￥{{price}}</span>
                                        </div>
                                    </div>
                                </a>
                                <div class="divider-line" style="margin: 10px 0"></div>
                                <div class="row order-btns">
                                    <a href="./order/to-order.html" class="button order-order">立即预约</a>
                                </div>
                            </li>
                            {{#unless @last}}
                            <li class="li-divider-15" style="padding: 0"></li>
                            {{/unless}}
                            {{/each}}
                        </ul>
                        <div class="row no-gutter divider" style="margin-top: 20px">
                            <div class="col-30 deep"></div>
                            <span>我也是有底线的</span>
                            <div class="col-30 deep"></div>
                        </div>
                    </div>
                </div>
                <div id="tab3" class="page-content tab">
                    <div class="list-block orders-list">
                        <ul>
                            {{#each consume}}
                            <li>
                                <a href="./order/detail.html?id={{id}}&type=3">
                                    <div class="row">
                                        <span class="order-id">订单号：{{id}}</span>
                                        <span class="order-status">待消费</span>
                                    </div>
                                    <div class="row">
                                        <span class="order-time">下单时间：{{time}}</span>
                                    </div>
                                    <div class="divider-line" style="margin: 10px 0"></div>
                                    <div class="row order-content">
                                        <img class="col-33" src="{{image}}">
                                        <div class="col-66">
                                            <div class="goods-desc">
                                                <span>{{desc}}</span>
                                            </div>
                                            <span class="goods-number">数量：x{{number}}</span><br>
                                            <span class="goods-price">￥{{price}}</span>
                                        </div>
                                    </div>
                                </a>
                                <div class="divider-line" style="margin: 10px 0"></div>
                                <div class="row order-btns">
                                    {{#js_if "this.type===1"}}
                                    <a class="button order-order">验证订单</a>
                                    {{/js_if}}
                                    {{#js_if "this.type===2"}}
                                    <a class="button order-order">确认收货</a>
                                    {{/js_if}}
                                    {{#if cancelBtn}}
                                    <a class="button order-cancel">取消订单</a>
                                    {{/if}}
                                </div>
                            </li>
                            {{#unless @last}}
                            <li class="li-divider-15" style="padding: 0"></li>
                            {{/unless}}
                            {{/each}}

                        </ul>
                        <div class="row no-gutter divider" style="margin-top: 20px">
                            <div class="col-30 deep"></div>
                            <span>我也是有底线的</span>
                            <div class="col-30 deep"></div>
                        </div>
                    </div>
                </div>
                <div id="tab4" class="page-content tab">
                    <div class="list-block orders-list">
                        <ul>
                            {{#each completed}}
                            <li>
                                <a href="./order/detail.html?id={{id}}&type=4">
                                    <div class="row">
                                        <span class="order-id">订单号：{{id}}</span>
                                        <span class="order-status">已完成</span>
                                    </div>
                                    <div class="row">
                                        <span class="order-time">下单时间：{{time}}</span>
                                    </div>
                                    <div class="divider-line" style="margin: 10px 0"></div>
                                    <div class="row order-content">
                                        <img class="col-33" src="{{image}}">
                                        <div class="col-66">
                                            <div class="goods-desc">
                                                <span>{{desc}}</span>
                                            </div>
                                            <span class="goods-number">数量：x{{number}}</span><br>
                                            <span class="goods-price">￥{{price}}</span>
                                        </div>
                                    </div>
                                </a>
                                <div class="divider-line" style="margin: 10px 0"></div>
                                <div class="row order-btns">
                                    <a class="button order-pay">分享获取5元</a>
                                    <a class="button order-order">再次购买</a>
                                </div>
                            </li>
                            {{#unless @last}}
                            <div class="li-divider-15" style="padding: 0"></div>
                            {{/unless}}
                            {{/each}}
                        </ul>
                        <div class="row no-gutter divider" style="margin-top: 20px">
                            <div class="col-30 deep"></div>
                            <span>我也是有底线的</span>
                            <div class="col-30 deep"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


